<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <div id="root">
    <div id="tab1"></div>
    <div id="tab2"></div>
    <div id="tab3"></div>
  </div>
</body>

<link rel="stylesheet" href="./index.css">

<script src="./index.js"></script>
<script src="./data.js"></script>
<script>

  const tabDom1 = document.querySelector('#root #tab1')
  // const tabDom2 = document.querySelector('#root #tab2')
  // const tabDom3 = document.querySelector('#root #tab3')

  console.log(tabDom1)

  new Tab(tabDom1, tab1, { autoPlay: false, toggle: false })
  // new Tab(tabDom2, tab2, { autoPlay: false, toggle: true })
  // new Tab(tabDom3, tab3, { autoPlay: true, toggle: false })

</script>
</html>